<template>
  <view class="bg-#f6f7f8 px-24rpx">
    <view v-for="(item, index) in jobList" :key="index" class="job-item mb-32rpx bg-#fff rounded-26rpx">
      <view v-if="isreferral">
        <view v-for="(ite, inx) in item.list" :key="inx"
          class="job-item bg-#f7f9ff flex items-center px-40rpx py-24rpx">
          <view class="relative mr-[20rpx]">
            <image src="https://yiliao.test03.qcw800.com/static/images/tab/user-01.png"
              class="block h-[20rpx] w-[20rpx] absolute rigth-0 bottom-[5rpx]" style="right: 0" />
            <image class="w-72rpx h-72rpx rounded-[50%]" :src="ite.headerUrl" />
          </view>
          <view class="flex flex-col justify-center">
            <view class="mb-14rpx flex items-center justify-between">
              <view class="text-left text-[32rpx] text-[#1d2129]">
                {{ ite.name }}
              </view>
            </view>
            <view class="flex items-center text-left text-[26rpx] text-[#6e6d72]">
              <view v-for="(itemTab, indexTab) in ite.tabs" :key="indexTab" class="flex items-center justify-center">
                <view>{{ itemTab.label }}</view>
                <view v-if="indexTab != ite.tabs.length - 1" class="mx-10rpx h-28rpx w-2rpx bg-#6e6d72" />
              </view>
            </view>
          </view>
        </view>
      </view>
      <view class="px-40rpx py-24rpx">
        <view class="mb-14rpx flex items-center justify-between">
          <view class="text-left text-[32rpx] text-[#1d2129]">
            {{ item.job_name }}
          </view>
          <view class="text-[28rpx] text-[#1f50f2] font-semibold tracking-[-0.3rpx]">
            • {{item.status_name}}
          </view>
        </view>
        <view class="mb-24rpx flex items-center text-left text-[26rpx] text-[#6e6d72]">
          <view>{{item.province}}·{{item.city}}</view>
          <view class="mx-10rpx h-28rpx w-2rpx bg-#6e6d72" />
          <view>{{item.company_name}}</view>
        </view>
        <view class="mb-20rpx flex items-center justify-between b-b b-b-#f6f7f8 b-b-solid pb-18rpx">
        </view>
        <view class="flex items-center justify-between text-[26rpx] text-[#4e5968]">
          <view class="flex items-center text-left text-[26rpx] text-[#6e6d72]">
            <view>{{item.job_nature}}</view>
            <view class="mx-10rpx h-28rpx w-2rpx bg-#6e6d72" />
            <view>{{item.qualifications}}</view>
            <view class="mx-10rpx h-28rpx w-2rpx bg-#6e6d72" />
            <view>{{item.salary_min/1000}}k-{{item.salary_max/1000}}k·{{item.salary_count}}薪</view>
          </view>
          <view class="flex items-center">
            <view
              class="w-[104rpx] mr-14rpx h-[46rpx] rounded border-[0.5px] border-solid border-[#1f50f2] flex items-center justify-center text-[#1f50f2]">
              置顶</view>
            <view class="w-[104rpx] h-[46rpx] rounded flex items-center justify-center text-[#999] bg-#f5f5f5">复制</view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
  // import home01 from "@/static/images/tab/home-01.png";
  // import home06 from "@/static/images/tab/home-06.png";
  // import userCatch01 from "@/static/images/tab/user-header.png";
  const home06 = 'https://yiliao.test03.qcw800.com/static/images/tab/home-06.png'
  const home01 = 'https://yiliao.test03.qcw800.com/static/images/tab/home-01.png'
  const userCatch01 = 'https://yiliao.test03.qcw800.com/static/images/tab/user-header.png'
  const props = defineProps({
    isreferral: {
      type: Boolean,
      default: false,
    },
    jobList: {
      type: Array,
      default: () => [
      ],
    }
  });
  // let jobList = ref([
  //   {
  //     title: "专职药剂师",
  //     list: [
  //       {
  //         name: "杨女士",
  //         headerUrl: userCatch01,
  //         tabs: [
  //           {
  //             label: "中国医科大学",
  //             ico: "icon-a-zu121328_1",
  //           },
  //           {
  //             label: "医学院",
  //             ico: "icon-a-zu121326_1",
  //           },
  //           {
  //             label: "辅导员",
  //             ico: "icon-a-zu121327_1",
  //           },
  //         ],
  //       },
  //     ],
  //   },
  // ]);
</script>
